<template>
  <div>
    <h3>user 的页面</h3>
    <p>根据mockjs 中获取图片的src渲染图片</p>
    <div id="imgContainer">
      <img
      v-for="(item, index) in imgArr"
      :src="item"
      :key="index">
    </div>
  </div>
</template>
<style lang="less" scoped>
#imgContainer {
  padding: 30px;
  overflow: hidden;
  img {
    width: 100px;
    display: block;
    margin: 10px;
    height: auto;
    float: left;
  }
}
</style>
<script>
export default {
  name: 'User',
  data () {
    return {
      imgArr: []
    }
  },
  created () {
    this.$axios({
      method: 'get',
      url: '/mock/42/imgs'
    }).then(res => {
      console.log(res.data)
      const data = res.data.map(item => '../assets/avaters/' + item)
      this.imgArr.push(...data)
    })
  }
}
</script>
